import React,{Suspense} from 'react';
import {
    BrowserRouter,
    Route,
    Routes,
    Navigate
} from "react-router-dom";
import routes from "./RouterConfig";
import {ROUTETYPES} from "../types/route.d"
function RouterView() {
    const remderRoute=(arr:ROUTETYPES[])=>{
        return arr.map((item,index)=>{
            return item.path? <Route key={index} path={item.path} element={<item.component />}>
                {
                    item.children&&remderRoute(item.children)
                }
            </Route>
            :<Route key={index} path={item.from} element={<Navigate to={item.to} />}></Route>
        })
    }
    return (
        <Suspense fallback={<div>路有加载中</div>}>
            <BrowserRouter>
            <Routes>
                {
                    remderRoute(routes)
                }
            </Routes>
            </BrowserRouter>
        </Suspense>
    )
}

export default RouterView
